<div class="business-detail-gauge-topo">
	<div class="topo-container">
		{{view view.Topo
			id="businessDetailGaugeTopo"
			viewName="businessTopoView"
			class="topo-content"
			content=topoContent
			timePoint=timePoint
			menusConfig=topoMenusConfig
			onMenuClick="topoMenuClick"
			stateDoor=currentState
			onDropNodeToNode="onDropNodeToNode"
			onNodeStackClick="onNodeStackClick"
			onNodePfmsClick="onNodePfmsClick"
			onScaled="onTopoScaled"
			addLines="ByAddLinesSetIPfilter"
			addTopoLineIPfilter="addTopoLineIPfilter"
			sourceIpArr="sourceIpArr"
			saveLineToServer="saveLine"
			delNodesTodelIp="delNodesTodelIp"
			auth=auth}}
	</div>
	<div class="toolbar">
		<div class="btn-group">
		{{#unless auth.isNormal}}
			{{#if isNodeListOpen}}
			<button class="btn active" {{action "closeNodesPanel"}} title="关闭业务组件列表"><i class="iconfont icon-yewuzujianliebiao"></i></button>
			{{else}}
			<button class="btn" {{action "openNodesPanel"}} title="打开业务组件列表"><i class="iconfont icon-yewuzujianliebiao"></i></button>
			{{/if}}
			<button  {{bind-attr class=":btn isLinkNodeMode:active"}} {{action "setRelations"}} title="连线"><i class="iconfont icon-wcunchu"></i></button>
		{{/unless}}
			<button class="btn" {{action "zoomIn"}} title="放大"><i class="iconfont icon-fangda"></i></button>
			<button class="btn" {{action "zoomOut"}} title="缩小"><i class="iconfont icon-suoxiao"></i></button>
			<button class="btn" {{action "fullScreen"  target=view}} title="全屏"><i class="iconfont icon-quanping"></i></button>
			<button class="btn" {{action "resetTopo"}} title="重置"><i class="iconfont icon-zhongzhi"></i></button>
		{{#unless auth.isNormal}}
			<button class="btn" {{action "updateTopo"}} title="保存"><i class="iconfont icon-cunchu"></i></button>
		{{/unless}}
			<div class="scale">{{topoScale}}</div>
		</div>
	</div>
	<div class="magnetic-panel-outer apdex">
		<div class="magnetic-panel">
			<span class="val">{{appApdexAtTimePoint}}</span>
			<span class="title">{{appApdexAtTimePointText}}</span>
		</div>
	</div>
	{{#if isNodeListOpen}}
	<div class="apm-gridpanel business-node-list">
			<ul class="nav nav-tabs business-label-nav-tabs business-label-tabs clearfix">
				<li {{bind-attr class="serviceNode:active"}} ><a href="javascript:;"  {{action "addServiceNode"}}>添加服务节点</a></li>
				<li {{bind-attr class="labelNode:active"}}><a href="javascript:;" {{action "labelNode"}}>标签节点</a></li>
			</ul>
			{{#unless isLabelSwitch}}
				<div class="business-node-search" style="margin:10px 0;">
					{{input class="input span3" value=nodeKeyword }}
					<button class="btn btn-primary btn-large btn-delete-node" {{bind-attr disabled=isNodeUnSelected}} {{action "deleteNodes"}}>删除</button>
					<button class="btn btn-primary btn-large btn-append-to-canvas" {{bind-attr disabled=isNodeUnSelected}} {{action "addNodesToTopo"}}>放入画布</button>
				</div>
				<div class="apm-gridcontainer">
					<table class="conf-table conf-iprepair-tab">
						<thead>
							<tr>
								<th>业务组件名称</th>
								<th>服务</th>
							</tr>
						</thead>
						<tbody>
							{{#each nodes as |node|}}
								<tr {{bind-attr title=node._title class="node.isSelected:active"}} {{action "selectRelationNode" node}}>
									<td>{{node._displayName}}</td>
									<td>{{node.protocolName}}</td>
								</tr>
							{{else}}
								<tr>
									<td colspan="3">没有业务组件数据</td>
								</tr>
							{{/each}}
						</tbody>
					</table>
				</div>
				<div class="business-node-list-btn">
					<p class="business-node-append-tip"></p>
					<p class="business-custom-add">*若列表中没有，<a {{action "openAddCustomNode"}}>点这里手工添加</a></p>
				</div>
				<div class="business-node-list-bottom"></div>
			{{/unless}}	
			{{#if isLabelSwitch}}
				<div class="business-selectImg" >
					<div {{bind-attr class=":alert nodeAddformTip::hide"}}><strong>{{nodeAddformTip}}</strong></div>
					<div class="business-selectImg-group clearfix" >
						<label class="business-selectImg-label">标签名</label>
						{{input value=guageLabelName class="business-selectImg-input input" placeholder="请输入标签名"}}
					</div>
					<div class="business-selectImg-group ">
						<label class="business-selectImg-label">选择图标</label>
						<div class="business-selectImg-switch" {{action "selectIcon"}}>
							<div class="business-node-icon clearfix">
								{{#if aaa}}
									<img src={{selectedSmallIcon}} class="select-icon pull-left"/>
								{{/if}}
								<div class="business-tc clearfix">
									{{#if isShowSmallImg}}
										<div>
											<img class="business-node-img" src={{selectedSmallIcon}} />
											<span class="business-node-pt">{{selectedSmallName}}</span>
										</div>
									{{else}}
										<div class="">{{selectedSmallName}}</div>
									{{/if}}
								</div>
							</div>
							<span class="arrow"></span>
							{{#if selectIconOpen}} 
								<div class="select-icon-box">
									{{#each selectImg as |current|}}
										<div class="img-select-menu clearfix" {{action "iSselectedImg" current.url current.name}}>
											<img src={{current.url}} alt="图挂了" class="business-label-img-width" />
											<span class="business-label-img-name">{{current.name}}</span>
										</div>
									{{/each}}
								</div>
							{{/if}}
						</div>
					</div>
				</div>
				<div class="determine-cancel clearfix">
					<button class="btn btn-primary btn-large determine pull-right" {{action "labelDetermine"}}>确定</button>
				</div>
			{{/if}}
		</div>
	{{/if}}
</div>
{{#view view.Dialog
	id="businessDetailGaugeSetNodeName"
	title="设置业务组件名称"
	class="hide apm-dialog-wrap"
	autoOpen=false
	modal=true
	width=450
	dialogAction="setNodeName"
	buttons=dialogButtons}}
	<form class="form-horizontal" {{action "editApplication" on="submit"}}>
		<div {{bind-attr class=":alert nodeAddformTip::hide"}}><strong>{{nodeAddformTip}}</strong></div>
		<div class="control-group">
			<div class="controls">
				{{input class="input" maxlength="20" value=nodeForm.name}}
			</div>
		</div>
	</form>
{{/view}}

{{#view view.Dialog
	id="businessDetailGaugeSetL7"
	title="配置L7层服务"
	class="hide apm-dialog-wrap"
	autoOpen=false
	modal=true
	width=450
	dialogAction="setNodeL7"
	buttons=dialogButtons}}
	<form class="form-horizontal">
		<div {{bind-attr class=":alert nodeAddformTip::hide"}}><strong>{{nodeAddformTip}}</strong></div>
		<div class="control-group">
			<label class="control-label">服务名称</label>
			<div class="controls">
				{{view "select"
					class="span3"
					content=l7Options
					optionLabelPath="content.displaytext"
					optionValuePath="content.value"
					value=nodeForm.protocol
					selection=selectObject}}
			</div>
		</div>
	</form>
{{/view}}

{{#view view.Dialog
	id="businessDetailIPFilter"
	title="IP过滤"
	class="hide apm-dialog-wrap"
	autoOpen=false
	modal=true
	width=450
	dialogAction="IPFilter"}}
	<form class="form-horizontal">
		<div {{bind-attr class=":alert nodeAddformTip::hide"}}><strong>{{nodeAddformTip}}</strong></div>
		<div class="ip-name">仅计算以下IP的数据（为空时接收全部来源IP）:</div>
		<div class="mt6 sourceIpList" >
			<textarea value=''></textarea>
		</div>
		<div class="mt6 btn-right-line">
			<div class="business-editSourceIp">
				<button class="btn btn-primary" {{action "editSourceIp"}}>确定</button>
				<button class="btn " {{action "cancelSourceIp"}}>取消</button>
			</div>
		</div>
	</form>
{{/view}}

{{#view view.Dialog
	id="businessAddNoteToTopo"
	title="添加业务组件"
	class="hide apm-dialog-wrap"
	autoOpen=false
	modal=true
	width=450
	dialogAction="addCustomNodeToTopo"
	buttons=dialogButtons}}
	<form class="form-horizontal">
		<div {{bind-attr class=":alert nodeAddformTip::hide"}}><strong>{{nodeAddformTip}}</strong></div>
		<div class="control-group">
			<label class="control-label">业务组件名称</label>
			<div class="controls">
				{{input class="input" maxlength="20" value=nodeForm.name}}
			</div>
		</div>
		<div class="control-group">
			<label class="control-label">Ip</label>
			<div class="controls">
				{{input class="input" value=nodeForm.ip}}
			</div>
		</div>
		<div class="control-group">
			<label class="control-label">端口</label>
			<div class="controls">
				{{input class="input" value=nodeForm.port}}
			</div>
		</div>
		<div class="control-group">
			<label class="control-label">L7服务</label>
			<div class="controls">
				{{view view.parentView.select 
					class="service-select-width form-top-select"
					content=l7Options
					selectValue=nodeForm.protocol
					optionLabelPath="displaytext"
					optionValuePath="value"
				}}
			</div>
		</div>
	</form>
{{/view}}

{{#view view.Dialog
	id="businessDetailGaugeAddNodeToNewCluster"
	title="是否将两业务组件放入一个新的节点组?"
	class="hide apm-dialog-wrap"
	autoOpen=false
	modal=true
	width=450
	dialogAction="addNodeToNewCluster"
	buttons=dialogButtons}}
	<form class="form-horizontal">
		<div {{bind-attr class=":alert addClusterformTip::hide"}}><strong>{{addClusterformTip}}</strong></div>
		<div class="control-group">
			<label class="control-label" style="width:80px;">节点组名称</label>
			<div class="controls" style="margin-left:0;">
				{{input class="input" value=tempClusterName}}
			</div>
		</div>
	</form>
{{/view}}

{{view view.ThresholdConfig
	id="businessConfigThresholdView"
	targetResource="节点"
	isShowSystem=isShowSystemOrBusiness
	alarmTime=alarmTimeSlot
	appId=business.id}}

{{#view view.Dialog
	id="businessNodeSsl"
	title="设定SSL证书"
	class="hide"
	autoOpen=false
	modal=true
	width=450
	dialogAction="setNodeSsl"
	buttons=dialogButtons}}
	<form id="businessNodeSslForm" class="form-horizontal" enctype="multipart/form-data" method="POST">
		{{#if hasNodeSSL}}
		<div class="control-group">
			已设定SSL， <button class="btn btn-link" {{action "deleteNodeSsl"}}>删除证书</button> 或者 <button class="btn btn-link" {{action "resetNodeSsl"}}>重新设置</button>
		</div>
		{{else}}
		<div class="alert {{if nodeSslformTip '' 'hide'}}"><strong>{{nodeSslformTip}}</strong></div>
		<div class="control-group">
			<label class="control-label">证书类型</label>
			<div class="controls">
				{{view "select"
					class="span3"
					content=sslTypes
					optionLabelPath="content.displaytext"
					optionValuePath="content.value"
					value=nodeForm.ssltype}}
			</div>
		</div>
		<div class="control-group">
			<label class="control-label">私钥</label>
			<div class="controls">
				{{input type="file" name="privateKeyFile" value=nodeForm.privateKeyFile}}
			</div>
		</div>
		<div class="control-group">
			<label class="control-label">密码</label>
			<div class="controls">
				{{input class="input" type="password" value=nodeForm.sslpwd}}
			</div>
		</div>
		{{/if}}
	</form>
{{/view}}

{{#view view.Dialog
	id="businessNodeLua"
	title="编写Lua代码"
	class="hide business-detail-gauge-lua"
	autoOpen=false
	modal=true
	width=450
	height=300
	dialogAction="setLua"
	buttons=dialogButtons}}
	<form class="form-horizontal">
		<div class="alert {{if nodeLuaformTip '' 'hide'}}"><strong>{{nodeLuaformTip}}</strong></div>
		{{textarea value=nodeForm.lua}}
	</form>
{{/view}}

{{#view view.Dialog
	id="businessNodeSpecimen"
	title="导出协议样本包"
	class="hide business-detail-gauge-specimen"
	autoOpen=false
	modal=true
	width=500
	height=300
	dialogAction="downloadPSP"
	buttons=dialogButtons}}
	<form class="form-horizontal">
		<div class="control-group">
			<label class="control-label">导出时间段</label>
			<div class="controls">
				{{input type="number" class="input" value=nodeForm.time min="1"}}(秒)
			</div>
		</div>
		<div class="control-group">
			导出的协议样本包用于协议解码工作。点击确定后，系统将开始抓取协议样本包，完成后可在“管理配置”菜单下的“样本包”列表页中查看、下载。
		</div>
	</form>
{{/view}}